<template>
  <ContentField>
    <el-table :data="state.students">
      <el-table-column
        label="学院"
        prop="college"
        align="center"
        width="200"
      ></el-table-column>
      <el-table-column
        label="姓名"
        prop="name"
        align="center"
      ></el-table-column>
      <el-table-column
        label="分数"
        width="120"
        prop="submitted"
        align="center"
      ></el-table-column>
    </el-table>
  </ContentField>
</template>

<script setup>
import { onMounted, reactive } from "vue";
import ContentField from "../../components/ContentField.vue";
import $ from "jquery";
import { ElMessage } from "element-plus";

onMounted(() => {
  getData();
});

const state = reactive({
  students: [],
  scoreform: {
    userId: null,
    score: 0,
    judge: null,
  },
  selectedStudent: null,
  showDialog: false,
});
const getData = () => {
  $.ajax({
    url: "http://127.0.0.1:3000/showContestant",
    type: "GET",
    contentType: "application/json;charset=UTF-8",
    dataType: "json",
    success: function (response) {
      state.students = response.data;
      getData();
    },
    error: function (error) {
      console.log(error);
      ElMessage({
        message: "获取数据失败",
        type: "error",
      });
    },
  });
};
</script>

<style scoped></style>
